<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>TODO supply a title</title>
    </head>
    <body>
        <div>TODO write content</div>
        <ui:composition xmlns="http://www.w3.org/1999/xhtml"
                        xmlns:ui="http://java.sun.com/jsf/facelets"
                        xmlns:h="http://java.sun.com/jsf/html"
                        xmlns:f="http://java.sun.com/jsf/core"
                        xmlns:a4j="http://richfaces.org/a4j"
                        xmlns:rich="http://richfaces.org/rich">
            <h:head>
                <style type="text/css">
                    input[type = 'submit']{
                        margin:5px 0px 5px 10px;
                        padding:3px 5px 3px 5px;
                    }
                    .active-row {
                        background-color: #FFEBDA !important;
                        cursor: pointer;
                    }
                </style>
            </h:head>
            <h:form id="budget">
                <rich:panel header="财务预算编制" styleClass="content-hight">
                    <h:panelGrid columns="3">
                        <h:outputText value="年度:"/>
                        <h:selectOneMenu value="#{finBudgetEditBean.iyear}">
                            <f:selectItem itemValue="0" itemLabel=" - 请选择 - "/>
                            <f:selectItems value="#{finBudgetEditBean.yearli}"/>
                            <a4j:ajax event="change" render="queryButton"/>
                        </h:selectOneMenu>
                        <a4j:commandButton value="查询" action="#{finBudgetEditBean.queryli}" render="editArea"
                                           onclick="this.disabled = 'true';" id="queryButton"
                                           disabled="#{finBudgetEditBean.iyear eq 0}"/>
                    </h:panelGrid>
                    <h:panelGroup id="editArea">
                        <rich:toolbar id="tolbar">
                            <a4j:commandButton value="编辑" render="editArea" action="#{finBudgetEditBean.edit}"
                                               disabled="#{finBudgetEditBean.editli eq null}"/>
                            <a4j:commandButton value="保存" render="editArea" action="#{finBudgetEditBean.save}"
                                               onclick="this.disabled = 'true';"
                                               disabled="#{!finBudgetEditBean.editStatus}"/>
                            <a4j:commandButton value="取消" render="editArea" action="#{finBudgetEditBean.cancel}"
                                               disabled="#{!finBudgetEditBean.editStatus}"/>
                        </rich:toolbar>
                        <div style="width:600px;">
                            <rich:dataTable style="width: 100%">
                                <f:facet name="header">
                                    <rich:columnGroup>
                                        <rich:column style="width:40px;">
                                            序号
                                        </rich:column>
                                        <rich:column style="width: 300px;">
                                            财务项目
                                        </rich:column>
                                        <rich:column>
                                            预算
                                        </rich:column>
                                    </rich:columnGroup>
                                </f:facet>
                            </rich:dataTable>
                            <div style="height:400px;overflow:auto">
                                <rich:dataTable id="editTable" value="#{finBudgetEditBean.editli}" var="stats" rowKeyVar="rowKey"
                                                onrowmouseover="this.style.backgroundColor='#F1F1F1'"
                                                onrowmouseout="this.style.backgroundColor='#{a4jSkin.tableBackgroundColor}'"
                                                noDataLabel="无数据!" style="width: 100%;margin-bottom: 5px;"
                                                styleClass="tableStyle">
                                    <rich:column style="width:40px;text-align:center">
                                        <h:outputText value="#{rowKey+1}"/>
                                    </rich:column>
                                    <rich:column style="width: 300px;">
                                        <h:outputText value="#{stats.projName}"/>
                                    </rich:column>
                                    <rich:column>
                                        <h:inputText value="#{stats.budget}" disabled="#{!finBudgetEditBean.editStatus}"
                                                     style="width:100%;text-align: right">
                                            <f:convertNumber pattern="#,##0.00" type="number"/>
                                        </h:inputText>
                                    </rich:column>
                                </rich:dataTable>
                                <rich:jQuery selector=".tableStyle tr" event="click" query="jQuery(this).addClass('active-row')"/>
                                <rich:jQuery selector=".tableStyle tr" event="click" query="jQuery('.tableStyle tr').not(this).removeClass('active-row')"/>
                            </div>
                        </div>
                    </h:panelGroup>
                </rich:panel>
            </h:form>
        </ui:composition>
    </body>
</html>
